<template>
	<view class="managementBox">
		<!-- top的tab切换 -->
		<!-- <view class="nav">
			<view class="navList" v-for="item in navList" :key="item.id" @click="tabClick(item.id)">
				<view  :class="navIndex==item.id ?'navWorda':'navWord'">
					{{item.type}}
				</view>
			</view>
		</view> -->
		<!-- type类型切换 -->
		<view class="typeBox">
			<view v-for="item in typelist" :key="item.id" :class="typeIndex == item.id ?'typeBoxSN':'typeBoxS'" @click="typeTabClick(item.id)">
				{{item.typeNa}}
			</view>
		</view>
		<!-- type的类型 -->
		<view class="typeContent">
			<view class="typeList" v-for="(item,index) in contentList" :key="index" @click="datailsClick(item)">
				<view class="typeCtime">
					<view class="tyctime">
						活动时间
						{{item.activitytime}}--{{item.endtime}}        
					</view>
						<view :class="item.qu_status==1?'tyStatusA':item.qu_status==2?'tyStatus':item.qu_status==3?'tyStatusB':''">
							{{item.qu_status==1?'待审核':item.qu_status==2?'已审核':item.qu_status==3?'已拒绝':''}}
						</view>
				</view>
<!-- 				<view class="tyName">
					<view class="tyName1">
						姓名：
					</view>
					<view class="tyName2">
						{{item.name}}
					</view>
				</view> -->
				<!-- <view class="tyBudget">
					<view class="tyBudget1">
						预算：
					</view>
					<view class="tyBudget2">
						{{item.money}}
					</view>
				</view> -->
				<view class="tyIntention">
					<view class="tyIntention1">
						活动名称：
					</view>
					<view class="tyIntention2">
						{{item.activity_name}}
					</view>
				</view>
				<view class="tyIntention">
					<view class="tyIntention1">
						经销店名称：
					</view>
					<view class="tyIntention2">
						{{item.stores}}
					</view>
				</view>
				<view class="tyIntention">
					<view class="tyIntention1">
						活动地址：
					</view>
					<view class="tyIntention2">
						{{item.address}}
					</view>
				</view>
			</view>
		</view>
		<!-- <view class="fillBox" @click="fillClick">
			<image src="/static/pages/index/fillImg.png" class="fillImg" mode=""></image>
		</view> -->
	</view>
</template>

<script>
	import {regionToExamine} from '@/request/api.js';
	export default {
		
		data() {
			return {
				navList:[
					{
						type:"销售数据",
						id:1
					},
					{
						type:"客户数据",
						id:2
					},
				],
				navIndex:1,//nav切花
				typelist:[
					{
						typeNa:'全部',
						id:1
					},
					{
						typeNa:'已审核',
						id:2
					},
					{
						typeNa:'未审核',
						id:3
					},
					{
						typeNa:'拒绝',
						id:4
					}
				],
				typeIndex:1,//type切换
				contentList:[],//假数据
				statuss:0,
				names:'',
				page:1,
				pageShow:false,
				
			};
		},
		onLoad() {
			this.uObj=uni.getStorageSync('regionMessage')
			console.log(this.uObj)
		},
		onShow() {
			this.page=1
			this.contentList=[];
			this.pageShow=false;
			this.init()
		},
		onReachBottom() {
			if(this.pageShow){
				this.init()
			}
		},
		methods:{
			formatDate: function(value) {
				let date = new Date(value * 1000);
				//时间戳为10位需*1000，时间戳为13位的话不需乘1000
				let y = date.getFullYear();
				let MM = date.getMonth() + 1;
				MM = MM < 10 ? ('0' + MM) : MM; //月补0
				let d = date.getDate();
				d = d < 10 ? ('0' + d) : d; //天补0
				let h = date.getHours();
				h = h < 10 ? ('0' + h) : h; //小时补0
				let m = date.getMinutes();
				m = m < 10 ? ('0' + m) : m; //分钟补0
				let s = date.getSeconds();
				s = s < 10 ? ('0' + s) : s; //秒补0
				// console.log(y + '-' + MM + '-' + d);
				return y + '-' + MM + '-' + d; //年月日
					
			},
			init(){
				let _this = this;
				let data ={
					user_id:_this.uObj.id,
					status:_this.statuss,
					name:_this.names,
					type:1,
					page:_this.page
				}
				regionToExamine(data).then(res=>{
					if(res.code==1){
						// console.log(res);
						if(res.data.data.length>0){
							_this.page++
							_this.contentList =_this.contentList.concat(res.data.data);
							_this.pageShow=true;
							console.log(_this.contentList,999);
							// _this.contentList.forEach(item=>{
							// 	if(item){
							// 	item.activitytime=_this.formatDate(item.activitytime)
							// 	}
							// })
							// console.log(_this.contentList)
							res.data.data.forEach(item=>{
								// console.log(item,'时间时间')
								if(item){
								item.activitytime=_this.formatDate(item.activitytime)
								item.endtime=_this.formatDate(item.endtime)
								// item.activity.endtime_text=item.activity.endtime_text.slice(0,10)
								
								}
							})
						}else{
							_this.pageShow=false
						}
						
					}
				}).catch(err=>{
					console.log(err)
				})
			},
			tabClick(id){
				this.navIndex=id
			},
			
			//type切换
			typeTabClick(id){
				this.typeIndex=id
				// console.log(this.typeIndex,"索引type切换");
				this.page=1;
				this.contentList=[];
				this.pageShow=false;
				
				if(this.typeIndex==1){
					this.statuss=0;
					this.init()
				}else if(this.typeIndex==2){
					this.statuss=2
					this.init()
				}else if(this.typeIndex==3){
					this.statuss=1
					this.init()
				}else{
					this.statuss=3
					this.init()
				}
			},
			//审核详情
			datailsClick(item){
				//navIndex==1销售数据 反之亦然
				uni.navigateTo({
					url:`/pages/groundPole/groundMine/grounActivityDetails?id=${item.id}&&status=${item.status}&&stores=${item.stores}`
				})
		
			},
			//数据填报
			fillClick(){
				//navIndex==1销售数据 反之亦然
				if(this.navIndex==1){
					uni.navigateTo({
						url:'/pagesA/DLR/fillPages'
					})
				}else{
					uni.navigateTo({
						url:'/pagesA/DLR/customer'
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #FFFFFF;
	}
.managementBox{
	width: 100%;
	box-sizing: border-box;
	padding-bottom: 40rpx;
	overflow: hidden;
	position: relative;
	.nav{
		display: flex;
		justify-content: space-around;
		margin-top: 34rpx;
		.navList{
			
			.navWord{
				font-size: 36rpx;
				color: #909299;
				padding-bottom: 20rpx;
			}
		}
	}
	.typeBox{
		width: 100%;
		height: 100rpx;
		display: flex;
		justify-content: space-around;
		margin-top: 10rpx;
		.typeBoxS{
			color: #909299 ;
			font-size: 36rpx;
			line-height: 100rpx;
		}
	}
	.typeContent{
		width: 100%;
		overflow: hidden;
		.typeList{
			width: 670rpx;
			// height: 330rpx;
			box-sizing: border-box;
			margin: 40rpx auto 0;
			padding: 0 0 30rpx 0;
			box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(211, 213, 220, 0.4);
			border-radius: 24rpx;
			.typeCtime{
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 70rpx;
				padding: 0 24rpx;
				border-bottom: 2rpx solid #e6e6e6;
				.tyctime{
					font-size: 26rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #313233;
					
				}
				.tyStatus{
					width: 90rpx;
					height: 36rpx;
					background: #1855F6;
					border-radius: 18rpx;
					font-size: 22rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #F5F5F5;
					line-height: 36rpx;
					text-align: center;
					
				}
				.tyStatusA{
					width: 90rpx;
					height: 36rpx;
					background: #F69518;
					border-radius: 18rpx;
					font-size: 22rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #F5F5F5;
					line-height: 36rpx;
					text-align: center;
					
				}
				.tyStatusB{
					width: 90rpx;
					height: 36rpx;
					background:#F61861;
					border-radius: 18rpx;
					font-size: 22rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #F5F5F5;
					line-height: 36rpx;
					text-align: center;
					
				}
			}
			.tyName{
				margin-left: 25rpx;
				display: flex;
				margin-top: 54rpx;
				.tyName1{
					color: #313233 ;
					font-size: 36rpx;
					// margin-right: 161rpx;
					min-width: 200rpx;
				}
				.tyName2{
					color: #313233 ;
					font-size: 36rpx;
				}
			}
			.tyBudget{
				margin-left: 25rpx;
				display: flex;
				margin-top: 54rpx;
				.tyBudget1{
					color: #313233 ;
					font-size: 36rpx;
					margin-right: 161rpx;
					
				}
				.tyBudget2{
					color: #313233 ;
					font-size: 36rpx;
				}
			}
			.tyIntention{
				margin-left: 25rpx;
				display: flex;
				margin-top: 54rpx;
				.tyIntention1{
					color: #313233 ;
					font-size: 36rpx;
					min-width: 200rpx;
					// margin-right: 89rpx;
				}
				.tyIntention2{
					color: #313233 ;
					font-size: 36rpx;
				}
			}
		}
	}
	.fillBox{
		width: 130rpx;
		height: 130rpx;
		border-radius: 50%;
		position: fixed;
		bottom: 125rpx;
		right: 35rpx;
		image{
			width: 130rpx;
			height: 130rpx;
		}
	}
}
.navWorda{
	font-size: 36rpx;
	border-bottom: 2px solid #1855F6;
	padding-bottom: 20rpx;
	color: #1855F6;
	font-weight: 500;
}
.typeBoxSN{
	color: #1855F6 ;
	font-size: 36rpx;
	line-height: 100rpx;
}
</style>
